<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link rel="stylesheet/less" type="text/css" href="less/tab.less">
    <link rel="stylesheet" href="public/css/hb_wap.css">

    <!--<link rel="stylesheet/less" type="text/css" href="http://localhost:63342/less_study/less/index.less">-->
    <script src="public/js/less.js" type="text/javascript"></script>
    <title>tab组件</title>
</head>
<body>

<!--- tab切换容器 -->
<div class="hb_tab_container">

    <!--- tab切换标题 -->
    <div class="hb_tab_title_container">
        <a class="hb_tab_title_item" href="#title_1">标题一</a>
        <a class="hb_tab_title_item" href="#title_2">标题二</a>
        <a class="hb_tab_title_item" href="#title_3">标题三</a>
    </div>

    <!--- tab切换容器 -->
    <div class="hb_tab_content_container">
        <div id="title_1" class="hb_tab_content_item">title_1</div>
        <div id="title_2" class="hb_tab_content_item">title_2</div>
        <div id="title_3" class="hb_tab_content_item">title_3</div>
    </div>

</div>

</body>
</html>
